<?php if (!defined('THINK_PATH')) exit();?><!DOCTYPE html>
<html lang="zh-cn">
	<head>
		<meta charset="UTF-8">
		<meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
		<meta http-equiv="X-UA-Compatible" content="IE=edge">
		<title>考核成绩列表</title>
		<meta name="description" content="">
		<meta name="keywords" content="">
		<meta name="viewport" content="width=device-width, initial-scale=1, maximum-scale=1, user-scalable=no">
		<meta name="renderer" content="webkit">
		<meta http-equiv="Cache-Control" content="no-siteapp" />
		<link href="/mobile/Public/mobile/css/mui.min.css" rel="stylesheet"/>
    	<link href="/mobile/Public/mobile/css/sty.css" rel="stylesheet"/>
		<script src="/mobile/Public/mobile/js/jquery-1.9.1.js" type="text/javascript" charset="utf-8"></script>
	</head>
	<body id="body" style="background-color: #fff;">
		<header class="mui-bar mui-bar-nav">
	        <a class="mui-action-back mui-icon mui-icon-left-nav mui-pull-left"></a>
	        <h1 class="mui-title">绩效考核概况</h1>
        </header>
		<div class="mui-content">
			<div class="xChoseTime">
				<select name="notes" id="t1" class="xChoseYear">
					<?php if(is_array($notes)): foreach($notes as $key=>$notes): ?><option <?php if($ktime == $notes['ktime']) echo selected;?> value="<?php echo ($notes['id']); ?>"><?php echo ($notes['table_name']); ?></option><?php endforeach; endif; ?>
				</select>
			</div>
			<script type="text/javascript">
			    function kaohe1(){
			    	var notes_id = $('#t1').val();
			    	$.ajax({
			    		url: 'first',
			    		type: 'post',
			    		data: {id:notes_id},
			    		success:function(mes){
			    			// alert(mes);
			    			$("#allScoreList").remove();
							$("#first").html(mes);
			    		}
			    	});
			    }
			    $('#t1').change(function(){
					kaohe1();
				});
			</script>
			<div id="allScoreList" style="width: 95%;height: 62vh;display: inline-block;margin-left: 2.5%;"></div>
			<div id="first"></div>

			<input type="hidden" value="<?php echo ($list); ?>" id="allScore" />
			<input type="hidden" value="<?php echo ($list0); ?>" id="yuaneScore" />
			<input type="hidden" value="<?php echo ($list1); ?>" id="xzScore" />
			<input type="hidden" value="<?php echo ($list2); ?>" id="fzScore" />
			<input type="hidden" value="<?php echo ($yname); ?>" id="yname" />
			<input type="hidden" value="<?php echo ($ysum); ?>" id="ysum" />
			<input type="hidden" value="<?php echo ($yuane); ?>" id="yuane" />
			<input type="hidden" value="<?php echo ($xinz); ?>" id="xinz" />
			<input type="hidden" value="<?php echo ($fuz); ?>" id="fuz" />
			<input type="hidden" value="<?php echo ($team); ?>" id="team" />
			<input type="hidden" value="<?php echo ($pb_name); ?>" id="pb_name" />
			<input type="hidden" value="<?php echo ($pb_fen); ?>" id="pb_fen" />
			<input type="hidden" value="<?php echo ($month); ?>" id="months" />

			<div class="xChoseTime">
				<select name="notes" class="xSeleTime" id="t3">
					<?php if(is_array($notes2)): foreach($notes2 as $key=>$notes2): ?><option <?php if($ktime == $notes['ktime']) echo selected;?> value="<?php echo ($notes2['id']); ?>"><?php echo ($notes2['table_name']); ?></option><?php endforeach; endif; ?>
				</select>
				<select name="posts" class="xSelePeo" id="post3">
					<?php if(is_array($posts)): foreach($posts as $key=>$posts): ?><option value="<?php echo ($posts['posts_id']); ?>"><?php echo ($posts['posts_name']); ?></option><?php endforeach; endif; ?>
				</select>
				<select class="xSeleMon" onchange="xuanZe(this.value)">
					<option value="">请选择时间</option>
					<option value="1">季度</option>
					<option value="2">月份</option>
				</select>
				<!-- 按季度查看 开始 -->
				<select name="quarter" class="x-jidu" style="display: none;" id="quarter3">
					<option value="">请选择季度</option>
					<option value="1">第一季度</option>
					<option value="2">第二季度</option>
					<option value="3">第三季度</option>
					<option value="4">第四季度</option>
				</select>
				<!-- 按季度查看 结束 -->
				<!-- 按月份查看 开始 -->
				<select name="month" class="x-month" style="display: none;" id="month3">
					<option value="">请选择月份</option>
					<option value="01">1月</option>
					<option value="02">2月</option>
					<option value="03">3月</option>
					<option value="04">4月</option>
					<option value="05">5月</option>
					<option value="06">6月</option>
					<option value="07">7月</option>
					<option value="08">8月</option>
					<option value="09">9月</option>
					<option value="10">10月</option>
					<option value="11">11月</option>
					<option value="12">12月</option>
				</select>
				<!-- 按月份查看 结束 -->
			</div>
			<!-- 选中季度和月份分别显示对应的选择框js开始 -->
			<script type="text/javascript">
				function xuanZe(a){
					if (a==1) {
						$(".x-jidu").css("display","inline-block");
						$(".x-month").css("display","none");
					}else if(a==2){
						$(".x-month").css("display","inline-block");
						$(".x-jidu").css("display","none");
					}
				}
				function xuanZe1(b){
					if (b==1) {
						$(".x-jidu1").css("display","inline-block");
						$(".x-month1").css("display","none");
					}else if(b==2){
						$(".x-month1").css("display","inline-block");
						$(".x-jidu1").css("display","none");
					}
				}
			</script>
			<!-- 按岗位查看js 开始 -->
				<script type="text/javascript">
				    function huangang3(){
				    	var notes_id = $('#t3').val();
				    	var posts_id = $('#post3').val();
				    	$.ajax({
				    		url: 'three',
				    		type: 'post',
				    		data: {id:notes_id,posts_id:posts_id},
				    		success:function(mes){
				    			// alert(mes);
				    			$("#cirScoreList").remove();
								$(".verScoreList").remove();
								$("#three").html(mes);
				    		}
				    	});
				    }
				    $('#post3').change(function(){
						huangang3();
					});
				</script>
				<!-- 按岗位查看js 结束 -->
				<!-- 按月份查看js 开始 -->
				<script type="text/javascript">
				    function month3(){
				    	var notes_id = $('#t3').val();
				    	var posts_id = $('#post3').val();
				    	var month = $('#month3').val();
				    	$.ajax({
				    		url: 'three2',
				    		type: 'post',
				    		data: {id:notes_id,posts_id:posts_id,month:month},
				    		success:function(mes){
				    			// alert(mes);
				    			$("#cirScoreList").remove();
								$(".verScoreList").remove();
								$("#three").remove();
								$("#three1").remove();
								$("#three2").html(mes);
				    		}
				    	});
				    }
				    $('#month3').change(function(){
				    	month3();
				    });
				</script>
				<!-- 按月份查看js 结束 -->
				<!-- 按季度查看js 开始 -->
				<script type="text/javascript">
				    function quarter3(){
				    	var notes_id = $('#t3').val();
				    	var posts_id = $('#post3').val();
				    	var quarter = $('#quarter3').val();
				    	$.ajax({
				    		url: 'three1',
				    		type: 'post',
				    		data: {id:notes_id,posts_id:posts_id,quarter:quarter},
				    		success:function(mes){
				    			// alert(mes);
				    			$("#cirScoreList").remove();
								$(".verScoreList").remove();
								$("#three").remove();
								$("#three1").html(mes);
				    		}
				    	});
				    }
				    $('#quarter3').change(function(){
				    	quarter3();
				    });
				</script>
				<!-- 按季度查看js 结束 -->

			<!--各部门分档饼状图-->
			<div id="cirScoreList" style="width: 95%;height: 50vh;display: inline-block;margin-left: 2.5%;margin-top: 20px;padding: 10px 0 0 0;"></div>
			<!--各部门成绩柱状图-->
			<div style="width: 95%;display: inline-block;margin-left: 2.5%;" class="verScoreList" >
				<div id="verScoreList" style="width: 100%;height:50vh;display: inline-block;"></div>
			</div>
			<div id="three"></div>
			<div id="three1"></div>
			<div id="three2"></div>

			<!-- 成绩 -->
		</div>
		<script type="text/javascript" src="/mobile/Public/mobile/js/mui.min.js"></script>
		<script type="text/javascript" src="/mobile/Public/admin/js/echarts.min.js"></script>
		<script type="text/javascript">
			var all=$("#allScore").val(); //所有的
			var allS=all.split(",");
			var yuan=$("#yuaneScore").val(); //员额法官
			var yuanS=yuan.split(",");
			var xz=$("#xzScore").val(); //司法行政
			var xzS=xz.split(",");
			var fz=$("#fzScore").val(); //司法辅助
			var fzS=fz.split(",");
			var names=$("#yname").val();//名字
			var namesS=names.split(",");
			var sum=$("#ysum").val();//分数
			var sumS=sum.split(",");
			var pyuan = $("#yuane").val();
			var pyuane = pyuan.split(",");
			var xinz = $("#xinz").val();
			var pxinz = xinz.split(",");
			var fuz = $("#fuz").val();
			var pfuz = fuz.split(",");
			var team1 = $('#team').val();
			var team = team1.split(','); 
			var pb_name = $('#pb_name').val();
			var pb_nameS = pb_name.split(','); 
			var pb_fen = $('#pb_fen').val();
			var pb_fenS = pb_fen.split(','); 
			var monthS =  $('#months').val();
			// 所有部门对比的饼状图
			var allScoreEvent = echarts.init(document.getElementById('allScoreList'));
			var allScoreEventOption = {
				title : {
			        text: '平罗县人民法院所有人成绩分档概况对比',
	//		        subtext: '岗位：所有    成绩：分档   分档：一/二/三/不及格\n',
			        x:'center'
			    },
			    tooltip : {
			        trigger: 'item',
			        formatter: "{a} {b} :{d}%",
			        textStyle: {
	                    fontSize:13
	                }
			    },
			    legend: {
			        orient: 'vertical',
			        left: 'left',
					top:'8%',
			        data: ['优秀','良好','一般','不及格']
			    },
			    grid: [
			        {x: '7.5%',y: '65%', width: '80%', height: '30%',right:'2%'},
			    ],
			    xAxis: [
			    	{
			    		gridIndex: 0,
			        	type: 'category',
			            axisTick: {
			                alignWithLabel: true
			            },
			            data: ['员额法官','司法行政人员','司法辅助人员']
		            },
			    ],
			    yAxis: [
			        {
		        		gridIndex: 0,
		        		name:'岗位',
		        		show:false,
			        },
			    ],
			    series : [
			        {
			            name: '整体概况',
			            type: 'pie',
			            //roseType:'radius',
			            radius : '45%',
			            center: ['50%', '36%'],
			            color: ['#39CBCA', '#C2D138', '#FFA809', '#E25C36'],
//			            color: ['#6EE3F7', '#FFDC89', '#FEA1C0', '#8AC994'],
			            data:[
			                {value:allS[0], name:'优秀'},
			                {value:allS[1], name:'良好'},
			                {value:allS[2], name:'一般'},
			                {value:allS[3], name:'不及格'},
			            ],
			            label: {
				            normal: {
				                position: 'outside',
				                formatter: '{b} {c}%',
				                 textStyle: {
				                    color: '',
				                    fontSize: 13
				                }
				            }
				        },
			            itemStyle: {
			                emphasis: {
			                    shadowBlur: 10,
			                    shadowOffsetX: 0,
			                    shadowColor: 'rgba(0, 0, 0, 0.5)'
			                }
			            }
			        },
			        {
			            name: '员额法官',
			            type: 'pie',
			            //roseType:'radius',
			            radius : '25%',
			            center: ['30%', '80.2%'],
			            data:[
			                {value:yuanS[0], name:'优秀'},
			                {value:yuanS[1], name:'良好'},
			                {value:yuanS[2], name:'一般'},
			                {value:yuanS[3], name:'不及格'}
			            ],
			            label: {
				            normal: {
				                position: 'outside',
				                formatter: '{b} {c}%',
				                textStyle: {
				                    color: '',
				                    fontSize: 12
				                }
				            }
				        },
			            itemStyle: {
			                emphasis: {
			                    shadowBlur: 10,
			                    shadowOffsetX: 0,
			                    shadowColor: 'rgba(0, 0, 0, 0.5)'
			                }
			            }
			        },
			        {
			            name: '司法行政人员',
			            type: 'pie',
			            radius : '25%',
			            center: ['52%', '81%'],
			            data:[
			                {value:xzS[0], name:'优秀'},
			                {value:xzS[1], name:'良好'},
			                {value:xzS[2], name:'一般'},
			                {value:xzS[3], name:'不及格'}
			            ],
			            label: {
				            normal: {
				                position: 'outside',
				                formatter: '{b} {c}%',
				                 offset: [,100],
				                 textStyle: {
				                    color: '',
				                    fontSize: 12
				                }
				            }
				        },
			            itemStyle: {
			                emphasis: {
			                    shadowBlur: 10,
			                    shadowOffsetX: 0,
			                    shadowColor: 'rgba(0, 0, 0, 0.5)'
			                }
			            }
			        },
			        {
			            name: '司法辅助人员',
			            type: 'pie',
			            //roseType:'radius',
			            radius : '25%',
			            center: ['68%', '81%'],
			            data:[
			                {value:fzS[0], name:'优秀'},
			                {value:fzS[1], name:'良好'},
			                {value:fzS[2], name:'一般'},
			                {value:fzS[3], name:'不及格'}
			            ],
			            label: {
			            normal: {
			                position: 'outside',
			                formatter: '{b} {c}%',
			                 textStyle: {
			                    color: '',
			                    fontSize: 12
			                }
			            }
			        },
			            itemStyle: {
			                emphasis: {
			                    shadowBlur: 10,
			                    shadowOffsetX: 0,
			                    shadowColor: 'rgba(0, 0, 0, 0.5)'
			                }
			            }
			        },

			    ]
			};
			allScoreEvent.setOption(allScoreEventOption);

			//	饼状图
			var cirScoreEvent = echarts.init(document.getElementById('cirScoreList'));
			var cirScoreEventOption = {
			    title : {
			        text: '员额法官绩效考核成绩汇总',
			        x:'center'
			    },
			    tooltip : {
			        trigger: 'item',
			        formatter: "{a} <br/>{b} : {c} ({d}%)"
			    },
			    series : [
			        {
			            name: '分档比例',
			            type: 'pie',
			            radius : '55%',
			            center: ['50%', '55%'],
//			            color: ['#86D560', '#AF89D6', '#59ADF3', '#FF999A'],
						color: ['#39CBCA', '#C2D138', '#FFA809', '#E25C36'],
						label: {
				            normal: {
				                position: 'outside',
				                formatter: '{b} : {c}%',
				                textStyle: {
				                    color: '',
				                    fontSize: 14
				                }
				            }
				        },
			            data:[
			                {value:yuanS[0], name:'优秀'},
			                {value:yuanS[1], name:'良好'},
			                {value:yuanS[2], name:'一般'},
			                {value:yuanS[3], name:'不及格'},
			            ],
			            itemStyle: {
			                emphasis: {
			                    shadowBlur: 10,
			                    shadowOffsetX: 0,
			                    shadowColor: 'rgba(0, 0, 0, 0.5)'
			                }
			            }
			        }
			    ]
			};
			cirScoreEvent.setOption(cirScoreEventOption);

//			柱状图
			var verScoreEvent = echarts.init(verScoreList);
			var verScoreEventOption = {
			    title: {
			        text: '员额法官绩效考核成绩汇总',
			        x:'center'
			    },
			    tooltip: {
			        trigger: 'axis',
			        formatter: "{b} : {c}分",
			        axisPointer: {
			            type: 'shadow'
			        }
			    },
			    label:{ 
					normal:{ 
						show: true, 
						formatter: "{c}分",
						position: 'right'
					}
				},
			    grid: {
			        left: '3%',
			        right: '6%',
			        bottom: '3%',
			        containLabel: true
			    },
			    xAxis: {
			        type: 'value',
			        boundaryGap: [0, 0.01],
			        axisLabel: {
			            formatter: '{value} 分',
			        }
			    },
			    yAxis: {
			    	inverse:'true',
			        type: 'category',
			        axisLabel: {
			            interval:0
			        },
			        data: namesS
			    },
			    series: [{
			            type: 'bar',
			            sort: 'descending',
			            data: sumS
			        },
			    ]
			};
			verScoreEvent.setOption(verScoreEventOption);
		</script>
	</body>
</html>